export default class ShareMenu {
	constructor() {
		this.show = false
		this.shareMenu = undefined
		this.menuItems = [
			{ text: '微信', icon: '/uni_modules/xingluo-ui/static/imgs/share/weixin.png' },
			{ text: '朋友圈', icon: '/uni_modules/xingluo-ui/static/imgs/share/pengyouquan.png' },
			// {text: '复制链接', icon: '/static/share/copylink.png'},
		]
	}
	
	openShareMenu(options) {
		var screenHeight = plus.screen.resolutionHeight
		const menuHeight = 220
		const menuTop = screenHeight - menuHeight
		const iconSize = 44
		const iconTop = 66
		const iconGap = 32
		const textSize = 13
		const textTop = 126
		const btnHeight = 44
		this.shareMenu = new plus.nativeObj.View("shareMenu", { //先创建遮罩层
			top: '0px',
			left: '0px',
			height: '100%',
			width: '100%',
			backgroundColor: 'rgba(0,0,0,0.2)'
		});
		let items = []
		this.menuItems.forEach((item, i) => {
			items.push({
				tag: 'img',
				src: item.icon,
				position: {
					top: menuTop + iconTop,
					left: (i + 1) * iconGap + i * iconSize,
					width: iconSize,
					height: iconSize
				}
			})
			items.push({
				tag: 'font',
				text: item.text,
				textStyles: {
					size: textSize,
					align: 'center',
					color: '#333'
				},
				position: {
					top: menuTop + textTop,
					left: (i + 1) * iconGap + i * iconSize - 5,
					width: iconSize + 10,
					height: textSize
				}
			})
		})
		this.shareMenu.draw([
			{
				tag: 'rect',
				id: 'share-menu',
				color: 'rgba(0,0,0,0)',
				position: {
					bottom: '0',
					left: '0',
					width: '100%',
					height: menuHeight + 'px'
				}
			},
			{
				tag: 'rect',
				id: 'share-radius',
				color: '#fff',
				rectStyles: {
					radius: '20px'
				},
				position: {
					bottom: menuHeight - 140,
					left: '0',
					width: '100%',
					height: 140
				}
			},
			{
				tag: 'rect',
				id: 'share-gap',
				color: '#fff',
				position: {
					bottom: 0,
					left: 0,
					width: '100%',
					height: 200
				}
			},
			{
				tag: 'font',
				text: '分享到',
				textStyles: {
					size: 15,
					color: '#888'
				},
				position: {
					top: menuTop + 20,
					left: 0,
					width: 86,
					height: 30
				}
			},
			...items,
			{
				tag: 'rect',
				id: 'share-menu-cancel-btn',
				color: '#f5f5f5',
				rectStyles: {
					radius: '4px'
				},
				position: {
					bottom: '10px',
					left: '5%',
					width: '90%',
					height: btnHeight + 'px'
				}
			}, {
				tag: 'font',
				text: '取消分享', //底部取消按钮的文字
				textStyles: {
					size: '14px',
					color: '#666'
				},
				position: {
					bottom: ((btnHeight - 14) / 2 + 10) + 'px',
					height: '14px'
				}
			}
		])
		
		this.shareMenu.addEventListener("click", e => { 
			if(e.screenY < menuTop) {
				// 处理遮罩层点击
				this.hideShareMenu()
			} else if (e.screenY <= screenHeight - 10 && e.screenY >= screenHeight - btnHeight - 10) { //点击了底部取消按钮
				// 处理取消按钮
				this.hideShareMenu()
			} else if(e.screenY < screenHeight - (menuHeight-textTop-textSize) && e.screenY > screenHeight - (menuHeight - iconTop)){
				// 处理分享
				if(e.clientX >= iconGap - 5 && e.clientX <= iconSize + iconGap + 5) {
					options.provider = 'weixin'
					options.scene = 'WXSceneSession'
					uni.share(options)
					this.hideShareMenu()
				} else if(e.clientX >= 2 * iconGap + iconSize - 5  && e.clientX <= 2 * (iconGap + iconSize) + 5) {
					options.provider = 'weixin'
					options.scene = 'WXSceneTimeline'
					uni.share(options)
					this.hideShareMenu()
				} else if(e.clientX >= 3 * iconGap + iconSize - 5  && e.clientX <= 3 * (iconGap + iconSize) + 5) {
					uni.setClipboardData({
						data: options.href,
						success: () => {
							uni.hideToast() //关闭自带的toast
							uni.$xl.toast('复制成功')
							this.hideShareMenu();
						},
						fail: (err) => {
							uni.$xl.toast(err)
						}
					});
				}
			}
		})
		// this.openShareMenuAnimation();
		this.shareMenu.show()
		this.show = true
		
		plus.key.addEventListener('backbutton', () => {
			this.hideShareMenu();
		}, false)
	}
	hideShareMenu() {
		this.shareMenu.hide()
		// this.closeShareMenuAnimation()
		this.show = false
	}
	openShareMenuAnimation() {
		plus.nativeObj.View.startAnimation({
			type: 'slide-in-bottom',
			duration: 300
		}, this.shareMenu, {}, () => {
			console.log('plus.nativeObj.View.startAnimation动画结束');
			// 关闭原生动画
			plus.nativeObj.View.clearAnimation();
			this.shareMenu.show()
		});
	}
	closeShareMenuAnimation() {
		var options = {
			type: 'pop-out',
			duration: 300
		};
		plus.nativeObj.View.startAnimation(options, {
			view: this.shareMenu
		}, function() {
			console.log('plus.nativeObj.View.startAnimation动画结束'); // 关闭原生动画
			plus.nativeObj.View.clearAnimation();
		});
	}
}